<template>
  <el-container>
    <el-header>
      <div class="left-panel">
        <el-button v-if="$AUTH('customer:customer:add')" type="primary" icon="el-icon-plus" @click="add"></el-button>
      </div>
      <div class="right-panel">
        <div class="right-panel-search">
          <!-- 日期时间范围 -->
          <el-date-picker v-model="search.createTime" type="datetimerange" value-format="YYYY-MM-DD HH:mm:ss" start-placeholder="开始日期" end-placeholder="结束日期" style="width: 100%;"></el-date-picker>
          <el-input v-model="search.customerId" placeholder="用户" clearable></el-input>
          <el-input v-model="search.departmentId" placeholder="部门/分店" clearable></el-input>
          <el-input v-model="search.regionPath" placeholder="区域全路径" clearable></el-input>
          <el-input v-model="search.membershipLevel" placeholder="会员等级" clearable></el-input>
          <el-input v-model="search.urlName" placeholder="域名后缀" clearable></el-input>
          <el-input v-model="search.loginName" placeholder="登录账号" clearable></el-input>
          <el-input v-model="search.password" placeholder="密码" clearable></el-input>
          <el-input v-model="search.userName" placeholder="姓名" clearable></el-input>
          <el-input v-model="search.telephone" placeholder="电话" clearable></el-input>
          <el-input v-model="search.address" placeholder="地址" clearable></el-input>
          <el-input v-model="search.email" placeholder="邮箱" clearable></el-input>
          <el-input v-model="search.status" placeholder="1激活 0失效" clearable></el-input>
          <el-input v-model="search.lastInTime" placeholder="最后登录时间" clearable></el-input>
          <el-input v-model="search.createTime" placeholder="创建时间" clearable></el-input>
          <el-input v-model="search.lastPayTime" placeholder="最后续费时间" clearable></el-input>
          <el-input v-model="search.regFrom" placeholder="注册来源1pc 2android 3iso" clearable></el-input>
          <el-input v-model="search.integral" placeholder="积分(剩余积分)" clearable></el-input>
          <el-input v-model="search.integralCount" placeholder="总积分" clearable></el-input>
          <el-input v-model="search.gold" placeholder="金币" clearable></el-input>
          <el-input v-model="search.locked" placeholder="1锁定 0未锁定 登录超过次数" clearable></el-input>
          <el-input v-model="search.longitude" placeholder="经度" clearable></el-input>
          <el-input v-model="search.latitude" placeholder="纬度" clearable></el-input>
          <el-input v-model="search.nearbyTime" placeholder="获取经纬度时间" clearable></el-input>
          <el-input v-model="search.language" placeholder="语言编码" clearable></el-input>
          <el-input v-model="search.birthday" placeholder="生日" clearable></el-input>
          <el-input v-model="search.sex" placeholder="1男 2女 3其他" clearable></el-input>
          <el-input v-model="search.headPortrait" placeholder="头像地址" clearable></el-input>
          <el-input v-model="search.telVersion" placeholder="手机品牌型号" clearable></el-input>
          <el-input v-model="search.promoteNum" placeholder="推广员编码 谁推荐我安装的" clearable></el-input>
          <el-input v-model="search.wxOpenId" placeholder="微信openid 小程序" clearable></el-input>
          <el-input v-model="search.wxgzhOpenId" placeholder="公众号" clearable></el-input>
          <el-input v-model="search.unionid" placeholder="单点登录标识" clearable></el-input>
          <el-input v-model="search.qmImg" placeholder="水印签名图片" clearable></el-input>
          <el-input v-model="search.deleted" placeholder="0未删除 1删除" clearable></el-input>
          <el-button type="primary" icon="el-icon-search" @click="upsearch"></el-button>
        </div>
      </div>
    </el-header>
    <el-main class="nopadding">
      <scTable ref="table" :apiObj="apiObj" row-key="customerId" @selection-change="selectionChange" stripe>
        <el-table-column type="selection" width="50"></el-table-column>
        <el-table-column label="用户" prop="customerId" width="150"></el-table-column>
        <el-table-column label="部门/分店" prop="departmentId" width="150"></el-table-column>
        <el-table-column label="区域全路径" prop="regionPath" width="150"></el-table-column>
        <el-table-column label="会员等级" prop="membershipLevel" width="150"></el-table-column>
        <el-table-column label="域名后缀" prop="urlName" width="150"></el-table-column>
        <el-table-column label="登录账号" prop="loginName" width="150"></el-table-column>
        <el-table-column label="密码" prop="password" width="150"></el-table-column>
        <el-table-column label="姓名" prop="userName" width="150"></el-table-column>
        <el-table-column label="电话" prop="telephone" width="150"></el-table-column>
        <el-table-column label="地址" prop="address" width="150"></el-table-column>
        <el-table-column label="邮箱" prop="email" width="150"></el-table-column>
        <el-table-column label="1激活 0失效" prop="status" width="150"></el-table-column>
        <el-table-column label="最后登录时间" prop="lastInTime" width="150"></el-table-column>
        <el-table-column label="创建时间" prop="createTime" width="150"></el-table-column>
        <el-table-column label="最后续费时间" prop="lastPayTime" width="150"></el-table-column>
        <el-table-column label="注册来源1pc 2android 3iso" prop="regFrom" width="150"></el-table-column>
        <el-table-column label="积分(剩余积分)" prop="integral" width="150"></el-table-column>
        <el-table-column label="总积分" prop="integralCount" width="150"></el-table-column>
        <el-table-column label="金币" prop="gold" width="150"></el-table-column>
        <el-table-column label="1锁定 0未锁定 登录超过次数" prop="locked" width="150"></el-table-column>
        <el-table-column label="经度" prop="longitude" width="150"></el-table-column>
        <el-table-column label="纬度" prop="latitude" width="150"></el-table-column>
        <el-table-column label="获取经纬度时间" prop="nearbyTime" width="150"></el-table-column>
        <el-table-column label="语言编码" prop="language" width="150"></el-table-column>
        <el-table-column label="生日" prop="birthday" width="150"></el-table-column>
        <el-table-column label="1男 2女 3其他" prop="sex" width="150"></el-table-column>
        <el-table-column label="头像地址" prop="headPortrait" width="150"></el-table-column>
        <el-table-column label="手机品牌型号" prop="telVersion" width="150"></el-table-column>
        <el-table-column label="推广员编码 谁推荐我安装的" prop="promoteNum" width="150"></el-table-column>
        <el-table-column label="微信openid 小程序" prop="wxOpenId" width="150"></el-table-column>
        <el-table-column label="公众号" prop="wxgzhOpenId" width="150"></el-table-column>
        <el-table-column label="单点登录标识" prop="unionid" width="150"></el-table-column>
        <el-table-column label="水印签名图片" prop="qmImg" width="150"></el-table-column>
        <el-table-column label="0未删除 1删除" prop="deleted" width="150"></el-table-column>
<!--    <el-table-column label="创建时间" prop="createTime" width="150" :formatter="formatDate"></el-table-column>-->
        <el-table-column label="操作" fixed="right" align="right">
          <template #default="scope">
            <el-button v-if="$AUTH('customer:customer:edit')" type="text" size="small" @click="table_edit(scope.row, scope.$index)">编辑</el-button>
            <el-divider direction="vertical"></el-divider>
            <el-button v-if="$AUTH('customer:customer:del')" type="text" size="small" @click="table_del(scope.row, scope.$index)">删除</el-button>
          </template>
        </el-table-column>
      </scTable>
    </el-main>
  </el-container>

  <customerEdit-dialog v-if="dialog.customerEdit" ref="customerEditDialog" @success="handleSaveSuccess" @closed="dialog.customerEdit=false"></customerEdit-dialog>
</template>

<script>
  import customerAPI from '@/api/customer/customer';
  import customerEditDialog from './customerEdit';//1--导入
  export default {
    name: 'customer',
    components: {
        customerEditDialog//2发布
    },
    data() {
      return {
        dialog: {
          customerEdit: false
        },
        apiObj: customerAPI.customer.list,
        selection: [],
        search: {
          keyword: null,
          createTime: null
        }
      }
    },
    methods: {
      //添加
      add(){
        this.dialog.customerEdit = true
        this.$nextTick(() => {
          this.$refs.customerEditDialog.open()
        })
      },
      //编辑
      table_edit(row){
        this.dialog.customerEdit = true
        this.$nextTick(() => {
          this.$refs.customerEditDialog.open('edit').setData(row)
        })
      },
      //删除
      async table_del(row){
        var confirm = await this.$confirm('确定删除选中的项吗？', '提示', {
          confirmButtonText: 'ok',
          type: 'warning'
        }).catch(() => {})
        if(confirm !== 'confirm'){
          return false;
        }
        var res = await customerAPI.customer.delete.delete(row.customerId);
        if(res.code === 2000){
          this.$refs.table.refresh();
          this.$message.success("删除成功");
        }else{
          this.$alert(res.message, "提示", {type: 'error'});
        }
      },
      //表格选择后回调事件
      selectionChange(selection){
        this.selection = selection;
      },
      //搜索
      upsearch(){
        this.$refs.table.upData(this.search);
      },
      //本地更新数据
      handleSaveSuccess(){
        this.$refs.table.refresh();
      },
      handlePermissionSuccess(){
        this.$refs.table.refresh();
      },
      handleDataSuccess(){
        this.$refs.table.refresh();
      },
      formatDate(row,column) {// 获取单元格数据
        let data = row[column.property];
        if(data == null) {
          return null;
        }
        let dt = new Date(data);
        return dt.getFullYear() + '-' + (dt.getMonth() + 1) + '-' + dt.getDate() + ' ' + dt.getHours() + ':' + dt.getMinutes() + ':' + dt.getSeconds();
      },
    }
  }
</script>
<style>
</style>
